import React, { Component,PropTypes } from 'react'
import HeadView from '../config/HeadView';
import {NavBarBackItem, NavBarTitleItem, NavBarRightItem} from './NavbBarItems';
import NavigatorBarView from './NavigatorBarView';
import DCAction from '../actions/DCAction';
import dcalt from '../alt/DCAlt'
import DCStore from '../stores/DCStore'
import NotifyActions from '../actions/NotifyActions';
import InteractionManager from 'InteractionManager';
import TextView from '../config/Cell'
import LoadingFailView from '../config/LoadingFailView'

import {
	View,
	ListView,
	TouchableOpacity,
	Text,
	StyleSheet
}from 'react-native';

export default class DCData extends Component {
	constructor(props) {
		super(props);
		this.state = {
			dataSource: [],
			dataLastSource: [],
			showView: true,
		}
	};
	_renderRow =(rowData)=> {
    	return (
    		<View style = {{flexDirection: 'row'}}> 
                <TextView text = {rowData.type}/>
                <TextView text = {rowData.date}/>
      		</View>
    	);
    };
	//加载失败
    loadingFail = ()=> {
        this.state.showView = false
    };
    onChange = ()=> {
        this.state.dataSource = ALT.stores.DCStore.getState().dcNum
        this.state.dataLastSource = ALT.stores.DCStore.getState().lastDcNum
    };
	componentDidMount() {         
        ALT.actions.DCAction.queryObj('nowMon')
        ALT.actions.DCAction.queryObj('lastMon')          
        ALT.stores.DCStore.listen(this.onChange);
        NotifyActions.addNotifier('LoadingFailData', this.loadingFail, this);
    };
    componentWillUnmount() {
    	ALT.stores.DCStore.unlisten(this.onChange);
        NotifyActions.removeNotifier('LoadingFailData', this.loadingFail, this);
    };

	render(){
		var titleArray = ['类型','日期']

		var content;

		if (this.state.showView == false) {
            content =  (<LoadingFailView/>);
        }else if(this.state.dataSource.length == 0){
        	content = (<Text style = {{marginLeft: Common.size.width/2-as(30),marginTop: Common.size.height/2-as(80)}}>
							暂无数据
					   </Text>);
        }else{
        	content = (<ListView
        					style = {{flex:0,height: Common.size.height-as(164)}}
							enableEmptySections = {true}
							dataSource={new ListView.DataSource({rowHasChanged: (r1,r2)=>r1 !== r2}).cloneWithRows(this.state.dataSource)}
      						renderRow={this._renderRow}/>);
        }

		return(
			<View style = {{width: Common.size.width,height: Common.size.height, flex: 1,backgroundColor: 'white'}}>
				<NavigatorBarView
						leftItem={<NavBarBackItem
						isTabBar={this.props.containerMarginBottom > 0? true: false}/>}
						centerItem ={<NavBarTitleItem
						title='数据统计'/>}/>

				<HeadView titleArray = {titleArray}/>

				{content}

				<View style = {styles.bottomView}>
					<View style = {styles.bottomTile}>
						<Text style = {{fontSize: asFont(12)}}>
							上月合计点餐：{this.state.dataLastSource.length}
						</Text>

						<Text style = {{fontSize: asFont(12)}}>
							本月合计点餐：{this.state.dataSource.length}
						</Text>
					</View>

					<Text style = {styles.bottomText}>
						*☀️代表午餐，🌙代表晚餐
					</Text>
				</View>
			</View>
		)
	}
}

var styles = StyleSheet.create({
	bottomView: {
		flexDirection: 'row',
		width: Common.size.width,
		height: as(50),
		borderTopWidth: 2,
		borderTopColor: 'rgb(230,230,230)',
		position: 'absolute',
		bottom: 0,
		right: 0,
		backgroundColor: 'white'
	},
	bottomTile: {
		position: 'absolute',
		left: 5,
		top: 5,
	},
	bottomText: {
		position: 'absolute',
		right: 5,
		bottom: 5,
		color: 'red',
		fontSize: asFont(10),
	}
})

